<!DOCTYPE html>
<html lang="{% block html_lang %}{{ DEFAULT_LANG }}{% endblock html_lang %}" class="overflow-x-hidden">

<head>
  <title>{% block title %}{{ SITENAME|striptags }}{% endblock %}</title>
  <meta charset="utf-8" />
  <meta name="generator" content="Pelican" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  {% if SITESUBTITLE %}
  <meta name="description" content="{{ SITESUBTITLE }}" />
  {% endif %}
  <link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/bootstrap.min.css" />
  <link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/custom.css" />
  <link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/github.min.css">
  <link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/bootstrap-icons.css" />
  {% if "search" is plugin_enabled %}
  <link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/stork.css">
  {% endif %}
  <!-- <link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/pygment.css"> -->
  <!-- <link rel="stylesheet" href="../static/css/bootstrap.min.css" /> -->
  {% block meta %}
  {% endblock %}
</head>

<body>
  <nav class="navbar navbar-expand-lg bg-body-tertiary px-lg-3 px-md-2 px-1">
    <div class="container-fluid">
      <a class="navbar-brand mb-0 h1" href="{{ SITEURL }}">{{ SITENAME }}</a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
        aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarNav">
        {% if DISPLAY_CATEGORIES_ON_MENU %}
        <ul class="navbar-nav me-auto">
          {% for cat, _ in categories %}
          <li class="nav-item">
            <a class="nav-link {% if cat.name==category %}active{% endif %}" href="{{ SITEURL }}/{{ cat.url }}">{{
              cat.name }}</a>
          </li>
          {% endfor %}
          <li class="nav-item">
            <a class="nav-link {% if output_file=='categories.html' %}active{% endif %}"
              href="{{ SITEURL }}/categories.html">更多分类</a>
          </li>
        </ul>
        {% if "search" is plugin_enabled %}
        <span class="me-2">
          内容搜索：<input data-stork="sitesearch" />
        </span>
        {% endif %}
        <!-- <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
          <button class="btn btn-outline-success" type="submit">Search</button> -->
        <a class="nav-link" href="{{ SITEURL }}/archives.html"><button type="button"
            class="btn btn-outline-secondary">归档</button></a>
        {% endif %}
      </div>
    </div>
  </nav>
  <div data-stork="sitesearch-output" class="col-6 position-absolute z-3" style="right: 0;"></div>

  {% block content %}
  {% endblock %}
  <hr>
  <footer class="text-center container">
    {% if FOOTER_ELEMENT %}
    <div class="row row-cols-auto justify-content-center">
      {% for item in FOOTER_ELEMENT %}
      <div class="col">
        {% if item['img'] %}
        <img src="{{ item['img'] }}" class="img-fluid" style="max-width: 2rem;">
        {% endif %}
        <a href="{% if item['link'] %}{{item['link']}}{% else %}#{% endif %}" {% if item['link'] %} target="_blank" {%
          endif %} style="color: #787878; text-decoration-color: #787878;">{{item['text']}}</a>
      </div>
      {% endfor %}
    </div>
    {% endif %}
  </footer>
  <script src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/js/bootstrap.bundle.min.js"></script>
  {% if "search" is plugin_enabled %}
  <script src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/js/stork.js"></script>
  <script>
    stork.initialize("{{ SITEURL }}/{{ THEME_STATIC_DIR }}/js/stork.wasm")
    stork.downloadIndex("sitesearch", "{{ SITEURL }}/search-index.st")
    stork.attach("sitesearch")
  </script>
  {% endif %}
  {% if CLOUDFLARE_WEB_ANALYTICS %}
  <script defer src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon='{"token": "{{ CLOUDFLARE_BEACON_TOKEN }}"}'></script>
  {% endif %}
  {% if ENABLE_MATHJAX %}
  <script type="text/javascript" id="MathJax-script" async src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/js/mathjax-tex-svg.js"></script>
  {% endif %}

</body>
</html>